<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<html>
<head th:include="common/common_head::commonHeader(${applicationName})"></head>


<body class="sub-page">
    <div th:include="common/navigation :: navigation"></div>
    <div th:include="common/img :: img"></div>


<!-- header -->
    <div th:include="common/header :: header"></div>
	<div id="page-content">
		<section class="box-content box-1">
			<div class="container">
				<div class="row">
				<div class="col-md-4" style="height: 650px;" th:each="al,iterStat : ${articleList}">
					<div class="box-item"  style="height: 95%">
						<a  th:href="${'/article/'+al.articleId}" target="_blank">
							<img style="height: 240px;width:100%" th:src="${'/images/'+al.articleImgNo+'.jpg'}" class="img-responsive"/></a>
						<div class="content">
							<h3 style="height: 52px;"><a th:href="${'/article/'+al.articleId}" target="_blank"  th:text="${al.articleName}"></a></h3>
							<i class="fa fa-user"></i>
							<span href="#" th:text="${al.articleAuthors}"></span>&nbsp;
							<i class="fa fa-clock-o"></i>
							<span th:text="${#dates.format(al.articleInputDate, 'yyyy-MM-dd')}"></span>
							<br>
							<p> </p>
							<div style="height: 150px;">
								<p th:text="${al.articleContent}"></p>
							</div>

							<br>
							<span th:each="tl,iterStat : ${al.tagInfoList}">
								<i class="fa fa-tags"></i><a target="_blank"  th:href="${'/tag/'+tl.tagName}" th:text="${tl.tagName}"></a>
								</span>
						</div>
					</div>
				</div>
				</div>
				<div style="margin-bottom: 30px;"  id="page_on">
					<div class="col-md-3" ></div>
					<div class="col-md-6"><ul class="page" maxshowpageitem="5" pagelistcount="12"  id="page"></ul></div>
					<div class="col-md-3"></div>
				</div>
				<div id="SOHUCS" style="display: none;"></div>

			</div>
		</section>
		</div>

	<!-- FOOTER -->
	<footer>
		<div th:include="common/footer :: footer"></div>
	</footer>
	<div th:include="common/common_onload_js :: onLoadJs"></div>
	<script type="text/javascript"  th:inline="javascript">
		var totalCount =  [[${totalCount}]];
        var pageNumber =  [[${pageNumber}]];
        var urlPre =  [[${urlPre}]];

        var GG = {
            "kk":function(mm){
                if(mm==1){
                    window.location.href=getRootPath_dc()+urlPre;
                }else{
                    window.location.href=getRootPath_dc()+urlPre+mm;
                }
            }
        }
        $("#page").initPage(totalCount,pageNumber,GG.kk);

        function getRootPath_dc() {
            return window.location.protocol + '//' + window.location.host+"/";
        }

        if( totalCount<=12){
            $("#page_on").hide();
        }
	</script>

</body>
</html>